<template>
  <div class="je-admin-layout-page-preview-markdown">
    <div class="je-admin-layout-page-preview-markdown-context">
      <EditorMarkdown :value="text" type="preview" />
    </div>
  </div>
</template>
<script>
  import { defineComponent, ref } from 'vue';
  import { EditorMarkdown } from '@jecloud/ui';
  import { useRouter } from '@common/router';
  import { getMarkdownData } from '@/data/api/preview';
  export default defineComponent({
    name: 'Markdown',
    components: { EditorMarkdown },
    setup() {
      const router = useRouter();
      const { id, planCode } = router.currentRoute.value.params;
      const text = ref('');
      getMarkdownData({ JE_JRI_INTERFACE_ID: id, planCode }).then((data) => {
        text.value = data;
      });
      return { text };
    },
  });
</script>
<style lang="less">
  .je-admin-layout-page-preview-markdown {
    height: 100%;
    width: 100%;
    overflow: auto;
    background: #f0f0f0;
    &-context {
      width: 1200px;
      display: block;
      margin: 0 auto;
      background: #ffffff;
    }
  }
</style>
